import type { ToolItem } from './MultiTool/types';

type Factory = () => Promise<{
  default: Record<string, string>
}>;

const createSvg = (path: string) => (
  (props: Record<string, any>) => (
    <svg {...props} viewBox="-15 -15 330 330" >
      <path d={path} />
    </svg>
  )
);

export const loader = (factory: Factory) => (
  async () => {
    const result = await factory();
    const datas = result.default;
    const keys = Object.keys(datas);

    return keys.map<ToolItem>(key => {
      const val = datas[key];
      return {
        id: key,
        path: val,
        title: key,
        svgComponent: createSvg(val)
      }
    })
  }
);